<template>
    <div id="main" class="app-main" @click="isDo()">
        <router-view></router-view>
    </div>
</template>

<script>
    export default {
        data () {
            return {
                theme: this.$store.state.app.themeColor,
                timeOut: 30 * 60 * 1000, // 超时30分钟锁屏
                lastClickTime: new Date().getTime(),
                isNotice: false
            };
        },
        mounted () {

        },
        beforeDestroy () {

        },
        methods: {
            isDo () {
                this.lastClickTime = new Date().getTime();
            },
            initSetTimeout () {
                let vm = this;
                setInterval(function () {
                    let timer = new Date().getTime() - vm.lastClickTime;
                    if (timer > 30 * 60 * 1000 && !this.$store.state.app.isLockscreen) {
                        // 超过10s
                        console.log('30分钟未操作页面');
                        vm.$store.commit('setLockscreen', true);
                    }
                    if (timer > 29 * 60 * 1000 && !vm.isNotice) {
                        vm.$Notice.open({
                            title: '锁屏提示',
                            desc: '系统检测到您长时间未操作页面，即将进入锁屏状态！'
                        });
                        vm.isNotice = true;
                    }
                }, 10 * 60 * 1000);
            }
        },
        created () {
            this.initSetTimeout();
        }
    };
</script>

<style lang="less">
html,body{
    width: 100%;
    height: 100%;
    background: #f0f0f0;
    overflow: hidden;
}
.app-main{
    width: 100%;
    height: 100%;
}
/*弹窗高度自适应*/
.autoHeight {
    .ivu-modal{
        overflow: hidden;
        height: 80%;
        top: 10%;
        .ivu-modal-content{
            height: 100%;
            .ivu-modal-body{
                overflow-y: auto;
                height: -moz-calc( 100% - 102px );
                height: -webkit-calc( 100% - 102px );
                height: calc( 100% - 102px );
            }
        }
    }
}
</style>
